<template>
  <div id="result">
    <img class="header" src="../../assets/images/report.png" />
    <div class="bodyer">
      <p class="text">您已完成报备</p>
      <p class="content">感谢您的配合!</p>
    </div>
    <!-- <van-form class="bodyer">
      <van-cell style="color:red;text-align:center;" title="您已完成报备！" />
      <van-field
        v-if="form.name"
        v-model.trim="form.name"
        name="name"
        label="姓名"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.sex"
        v-model.trim="form.sex"
        name="sex"
        label="性别"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.cate"
        v-model.trim="form.cate"
        name="cate"
        label="证件类型"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.card_no"
        v-model.trim="form.card_no"
        name="card_no"
        label="证件号码"
        readonly
        colon
        center
        label-class="labeltext"
        maxlength="18"
      />
      <van-field
        v-if="form.phone"
        v-model.trim="form.phone"
        name="phone"
        label="手机号码"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.transfer"
        v-model.trim="form.transfer"
        name="transfer"
        label="是否中转"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.stagssq"
        v-model.trim="form.stagssq"
        name="stagssq"
        label="在连住址"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.hotel"
        v-model.trim="form.hotel"
        name="hotel"
        label="酒店名称"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.stagarea"
        v-model.trim="form.stagarea"
        name="stagarea"
        label="目的地"
        readonly
        colon
        center
        label-class="labeltext"
      />
      <van-field
        v-if="form.address"
        v-model.trim="form.address"
        name="address"
        label="详细地址"
        readonly
        colon
        center
        label-class="labeltext"
      />
    </van-form> -->
    <div class="footer">
      <van-button round style="width:40%;" type="info" @click="revise">
        修改
      </van-button>
      <van-button round style="width:40%;" type="info" @click="black">
        返回
      </van-button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Result',
  data() {
    return {
      form: {}
    }
  },
  created() {
    this.form = this.$store.state.report.form
  },
  methods: {
    revise() {
      this.$router.go(-1)
    },
    black() {
      this.$store.dispatch('setForm', {})
      this.$router.push('/report')
    }
  }
}
</script>

<style scoped lang="less">
#result {
  width: 100%;
  height: 100%;
  background-image: url('../../assets/images/result_background.png');
  background-size: cover;
  position: relative;
  .header {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 9rem;
    box-shadow: 4px 2px 4px #d1d2d4;
  }
  .bodyer {
    position: absolute;
    left: 0;
    top: 30%;
    width: 100%;
    text-align: center;
    .icon {
      font-size: 3em;
      font-weight: 600;
    }
    .text {
      font-size: 2em;
      font-weight: 600;
    }
    .content {
      font-size: 1.7em;
      font-weight: 600;
    }
  }
  .footer {
    position: absolute;
    left: 0;
    bottom: 5%;
    width: 100%;
    height: 2.5rem;
    display: flex;
    justify-content: space-around;
  }
}
</style>
